<template>
	<div class="cooperate-apply-list table-theme">
		<head-title title="合作--合作申请列表"></head-title>
		<el-card>
			<div class="top-menu">
				<div class="menu-left">
					<tabs-view :list="classifyList" :tabsIndex="type" @roleType="roleType"></tabs-view>
				</div>

				<div class="menu-right">
					<refresh-button @refresh="refreshPage"></refresh-button>
					<search-view :option="searchOption" @value="goSearch" @clear="refreshPage"></search-view>
				</div>
			</div>
			<el-button type="danger" size="small" @click="del(1)" style="margin:5px 0">批量删除</el-button>
			<p class="data-number">总店铺数：{{ total }}</p>
			<el-table :data="list" @selection-change="handleSelectionChange">
				<el-table-column type="selection" width="55"></el-table-column>
				<el-table-column label="序号" align="center" prop="quota_apply_id"></el-table-column>
				<el-table-column label="用户序号" align="center" prop="user_id"></el-table-column>
				<el-table-column label="端口" align="center" prop="port"></el-table-column>
				<el-table-column label="用户名" align="center" prop="nickname"></el-table-column>
				<el-table-column label="电话" align="center" prop="phone"></el-table-column>
				<el-table-column label="推荐人" align="center" prop="belong_refer"></el-table-column>
				<el-table-column label="头像" align="center" width="100">
					<template slot-scope="scope">
						<el-image :src="scope.row.heard_img" style="width: 50px; height: 50px; vertical-align: top;"></el-image>
					</template>
				</el-table-column>
				<el-table-column label="工厂名称" align="center" prop="company_name"></el-table-column>
				<el-table-column label="工厂风格" align="center" prop="factory_style"></el-table-column>
				<el-table-column label="工厂地址" align="center" prop="address"></el-table-column>
				<el-table-column label="时间" align="center" prop="add_time"></el-table-column>
				<el-table-column label="类型" align="center" prop="type_name"></el-table-column>
				<el-table-column label="操作" align="center">
					<template slot-scope="scope">
						<el-button type="danger" size="mini" @click="del(0,scope.row.quota_apply_id)">删除</el-button>
					</template>
				</el-table-column>
			</el-table>
			<div class="pages">
				<el-pagination background layout="prev, pager, next, jumper" :total="total" @current-change="init" :current-page="page"></el-pagination>
			</div>
		</el-card>
	</div>
</template>

<script>
import TabsView from '@/components/TabsView'
	export default {
		components:{
			TabsView
		},
		data() {
			return {
				list: [], // 列表
				total: 0,
				totalData: 0,
				type: 0,
				page: 0,
				classifyList: ['所有','申请店铺','申请厂家','申请代理商'],
				multipleSelection:[],
				searchOption:[{
					value:0,
					label:'申请ID'
				},{
					value:1,
					label:'推荐人'
				},{
					value:2,
					label:'电话'
				}],
				selectContent:'',
				classSelect:0
			};
		},
		methods: {
			// 初始化列表
			init(e) {
				this.page = e;
				let data = {
					page: e - 1 ? e - 1 : 0,
					limit: 10,
					type: this.type
				};

				if (this.type == 0) {
					delete data.type;
				}

				if (this.classSelect == 0) {
					data.store_apply_id = this.selectContent;
				} else if (this.classSelect == 1) {
					data.a_user_id = this.selectContent;
				} else if (this.classSelect == 2) {
					data.phone = this.selectContent;
				}

				this.$http(this.$ApiList.ApplyList, data).then(res => {
					this.list = [];
					if (res.datas.length != 0) {
						let type_name = ['申请店铺', '申请厂家', '申请代理商'];
						res.datas.data.forEach(item => {
							let index = item.type - 1;
							item.type_name = type_name[index];
							this.list.push(item);
						});
						this.total = res.datas.count;
					}
				});
			},
			goSearch(classSelect, selectContent) {
				this.classSelect = classSelect;
				this.selectContent = selectContent;
				this.init();
			},
			roleType(type) {
				this.type = type;
				this.init();
			},
			refreshPage() {
				this.page = 1;
				this.type = '';
				this.classSelect = 0;
				this.selectContent = '';
				this.init()
			},
			del(type,id){
				this.$confirm('此操作将永久删除, 是否继续?', '提示', {
						confirmButtonText: '确定',
						cancelButtonText: '取消',
						type: 'warning'
					})
					.then(() => {
						let data = {
							quota_apply_id:''
						}
						if(type == 0){
							data.quota_apply_id = id
						}else if(type == 1){
							this.multipleSelection.forEach(item=>{
								data.quota_apply_id += item.quota_apply_id + ','
							})
							data.quota_apply_id = data.quota_apply_id.substr(0,data.quota_apply_id.length -1);
						}
						this.$http(this.$ApiList.DelApply,data).then(res=>{
							this.$message({
								message: '删除成功',
								type: 'success'
							});
							this.init();
						})
					})
					.catch(() => {
						this.$message({
							type: 'info',
							message: '已取消删除'
						});
					});
				
					
			},
			handleSelectionChange(val) {
				this.multipleSelection = val
			},
		},
		created() {
			this.init();
		}
	};
</script>
<style lang="scss" scoped>
</style>
